@extends('layouts.header')
@section('title','购买短信')
@section('content')
    <article class="page-container">
        <form class="form form-horizontal" id="myform" autocomplete="off">
            <div class="row cl">
                <label class="form-label col-xs-3">购买人：</label>
                <div class="formControls col-xs-9">
                    {{$data['realname']}}
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-3">单价：</label>
                <div class="formControls col-xs-9">
                    <input type="number" readonly class="input-text inline" name="unit_price" value="7"> <span>分</span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-3">支付总金额：</label>
                <div class="formControls col-xs-9">
                    <input type="number" min="10" max="10000" class="input-text inline required" name="price" value="10"> <span>元</span>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-3">折合短信条数：</label>
                <div class="formControls col-xs-9">
                    <input type="text" readonly class="input-text inline" name="sms_num" value="143"> <span>条</span>
                </div>
            </div>

            <div class="row cl">
                <label class="form-label col-xs-3">支付状态：</label>
                <div class="formControls col-xs-9">
                    <div class="radio-box">
                        <input type="radio" id="radio-1" name="is_paid" checked value="1">
                        <label for="radio-1">未支付</label>
                    </div>
                    <div class="radio-box">
                        <input type="radio" id="radio-2" name="is_paid" value="2">
                        <label for="radio-2">已支付</label>
                    </div>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-3">发票代码：</label>
                <div class="formControls col-xs-6">
                    <input type="text" class="input-text" id="inv_code" name="inv_code">
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-3">发票编号：</label>
                <div class="formControls col-xs-6">
                    <input type="text" class="input-text" id="inv_no" name="inv_no">
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-xs-3">开票日期：</label>
                <div class="formControls col-xs-6">
                    <input type="date" class="input-text" id="inv_date" name="inv_date">
                </div>
            </div>

            @csrf

            <div class="row cl pt-20">
                <div class="col-xs-9 col-xs-offset-3">
                    <a class="btn btn-primary radius" id="submit"> 提交 </a>
                    <input class="btn btn-danger radius ml-15" type="button" value="取消" onclick="layer_close();">
                </div>
            </div>
        </form>
    </article>

    <script type="text/javascript">
        $(function () {
            $('input[name=price]').on('change', function () {
                let price = $(this).val();
                $('input[name=sms_num]').val(Math.ceil(price * 100 / 7));
            })
            $('#submit').on('click',function () {
                if($('#myform').valid()){
                    let oData = {
                        param: $('#myform').serializeArray()
                    }
                    ajax('post','',oData);
                }
            })
        });
    </script>
@endsection
